<template>
    <div>
        <el-card shadow="always" :body-style="{ padding: '20px' }" style="width: 80vw; margin: auto; margin-top: 50px;">
            <div style="margin-top: 20px;">
                <div style="width: 30%; float: left;">
                    出库时间： <el-date-picker v-model="daterangeCreateTime" value-format="YYYY-MM-DD" type="daterange"
                        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
                </div>
                <div style="float: left;">
                    出库类型
                    <el-select v-model="queryParams.storageInType" placeholder="Select" style="width: 240px">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                </div>
                <div style="width: 30%;float: left;margin-left: 20px;">
                    <el-input style="padding-right: 0%;" placeholder="药名" v-model="queryParams.medicineName">
                        <template #suffix>
                            <el-button type="primary" size="default" @click="getList">查找</el-button>
                        </template>
                    </el-input>
                </div>
            </div>
            <div style="margin-top: 100px; ">
                <!-- 出入库表单展示 -->
                <el-table :data="StorageTableData" border="true">
                    <el-table-column type="index" label="序号"></el-table-column>
                    <el-table-column label="单号" prop="storageInId" />
                    <el-table-column label="药品编码" prop="medicineId" />
                    <el-table-column label="药品名称" prop="medicineName" />
                    <el-table-column label="规格" prop="medicineSpecification" />
                    <el-table-column label="生产厂商" prop="manufacturerName" />
                    <el-table-column label="出库类型" prop="storageInType" />
                    <el-table-column label="采购价(元)" prop="purchasePrice" />
                    <el-table-column label="数量" prop="storageInQuantity" />
                    <el-table-column label="采购成本(元)" prop="amountpurchase" />
                    <el-table-column label="出库人员" prop="medicineAdmin" />
                    <el-table-column label="审核人员" prop="medicineAdminReview" />
                    <el-table-column label="审核日期" prop="reviewDate" />
                </el-table>
                <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
                    v-model:limit="queryParams.pageSize" @pagination="getList" />
            </div>
        </el-card>
    </div>
</template>

<script lang="ts" setup>
import { reactive, ref } from 'vue';
import { listJob } from "../../../../api/statistics/test";
import { outputMedicDetail } from "../../../../api/report/medisstroge"
// 类别绑定值
const daterangeCreateTime = ref([]);
const total = ref(0);
//出入库数据类型
const inputStorage = {}
//  搜索参数
const queryParams = ref({
    pageNum: 1,
    pageSize: 10,
    storageInType:"",
    medicineName:""
})
// 出入库数据集合
const StorageTableData = ref([])
// 搜索参数提示字符
// 分类集合
const options = reactive([
    {
        value: '科室领药',
        label: '科室领药',
    },
    {
        value: '报损出库',
        label: '报损出库',
    },
    {
        value: '采购退货',
        label: '采购退货',
    }
])
// 时间绑定值
const value2 = ref('')
// 时间格式转换
const dsatefomat = (value, args) => {
    var dt = new Date(value);
    if (args == 'yyyy-M-d') {// yyyy-M-d
        let year = dt.getFullYear();
        let month = dt.getMonth() + 1;
        let date = dt.getDate();
        return `${year}-${month}-${date}`;
    } else if (args == 'yyyy-M-d H:m:s') {// yyyy-M-d H:m:s
        let year = dt.getFullYear();
        let month = dt.getMonth() + 1;
        let date = dt.getDate();
        let hour = dt.getHours();
        let minute = dt.getMinutes();
        let second = dt.getSeconds();
        return `${year}-${month}-${date} ${hour}:${minute}:${second}`;
    } else if (args == 'yyyy-MM-dd') {// yyyy-MM-dd
        let year = dt.getFullYear();
        let month = (dt.getMonth() + 1).toString().padStart(2, '0');
        let date = dt.getDate().toString().padStart(2, '0');
        return `${year}-${month}-${date}`;
    } else {// yyyy-MM-dd HH:mm:ss
        let year = dt.getFullYear();
        let month = (dt.getMonth() + 1).toString().padStart(2, '0');
        let date = dt.getDate().toString().padStart(2, '0');
        let hour = dt.getHours().toString().padStart(2, '0');
        let minute = dt.getMinutes().toString().padStart(2, '0');
        let second = dt.getSeconds().toString().padStart(2, '0');
        return `${year}-${month}-${date} ${hour}:${minute}:${second}`;
    }
}
/** 查询收费管理列表 */
function getList() {
    queryParams.value.params = {};
    if (null != daterangeCreateTime && '' != daterangeCreateTime) {
        queryParams.value.params["beginCreateTime"] = daterangeCreateTime.value[0];
        queryParams.value.params["endCreateTime"] = daterangeCreateTime.value[1];
    }
    outputMedicDetail(queryParams.value).then(response => {
        StorageTableData.value = response.rows;
        console.log(StorageTableData.value);
        total.value = response.total;
    });
}
getList()
</script>

<style scoped></style>